<template>
	<div class="index" ref='index'>
		<van-nav-bar title='首页' :border="false"></van-nav-bar>
		<div class="bg">
			<div class="notice">
				<div class="note-title">
					<img class="noticeImg" src="../../assets/imgs/notice.png" />
					<h6>系统通知</h6>
				</div>
				<div class="noticeInfo" v-show="allInfo.length>0" v-for="(item,i) in allInfo" :key='i'>
					<span class="dot"></span>
					<span class="noticeText">设备{{item.facilityName}}出现故障，请及时维修</span>
				</div>
				<div class="noData" v-show="allInfo.length===0">
					<p>暂无通知!</p>
				</div>
			</div>
		</div>
		<div class="border"></div>
		<!-- 设备管理 -->
		<div class="device">

			<h5 class="title">设备管理</h5>
			<van-grid :column-num="3" :border="false">
				<van-grid-item text="设备添加" @click='goDeviceAdd'>
					<img class="iconslot" style="background: #fab571;" src="../../assets/imgs/addDevice.png" slot='icon' />
				</van-grid-item>
				<van-grid-item text="设备信息" @click='goDevice'>
					<img class="iconslot" style="background: lightskyblue;" src="../../assets/imgs/device2.png" slot='icon' />
				</van-grid-item>
				<van-grid-item text="网关信息" @click='goGateway'>
					<img class="iconslot" style="background: rgb(183, 207, 222);" src="../../assets/imgs/gateway2.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" @click='goKeep' text="设备保养">
					<img class="iconslot" style="background: lightskyblue;" src="../../assets/imgs/deviceProject.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" @click='goKeepSearch' text="保养查询">
					<img class="iconslot" style="background: rgb(181, 210, 176);" src="../../assets/imgs/search2.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" text="设备维修" @click='goRepair'>
					<img class="iconslot" style="background: #e87f71;" src="../../assets/imgs/deviceRepair.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" @click='goRepairSearch' text="维修查询">
					<img class="iconslot" style="background: #76c7c7;" src="../../assets/imgs/search1.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" text="巡检" @click='goCheck'>
					<img class="iconslot" style="background: #f5ec6f" src="../../assets/imgs/deviceCheck.png" slot='icon' />
				</van-grid-item/>
				<van-grid-item icon="photo-o" text="故障/异常报修" @click='goDeviceFault'>
					<img class="iconslot" style="background: #b7cfde" src="../../assets/imgs/deviceFault.png" slot='icon' />
				</van-grid-item>
				<van-grid-item icon="photo-o" text="技改申请" @click='goChangeFor'>
					<img class="iconslot" style="background: #b7cfde" src="../../assets/imgs/addDevice.png" slot='icon' />
				</van-grid-item>

			</van-grid>
		</div>

    <!-- 人员管理-->
    <div class="device">
    	<h5 class="title">人员管理</h5>
      <van-grid :column-num="3" :border="false">
    	<van-grid-item icon="photo-o" text="添加当班人员" @click='goAddCurMan'>
    		<img class="iconslot" style="background: #efc745" src="../../assets/imgs/addMan.png" slot='icon' />
    	</van-grid-item>
    	<van-grid-item icon="photo-o" text="修改当班人员" @click='goEditCurMan'>
    		<img class="iconslot" style="background: #b7cfde" src="../../assets/imgs/editMan.png" slot='icon' />
    	</van-grid-item>
      </van-grid>
    </div>
		<!-- 现场管理 -->
		<div class="device">
			<h5 class="title">现场管理</h5>
			<van-grid :column-num="3" :border="false">
				<!-- <van-grid-item text="添加摄像头">
					<img class="iconslot" style="background: #ddd;" src="../../assets/imgs/crema.png" slot='icon' />
				</van-grid-item> -->
				<van-grid-item icon="photo-o" text="现场查看" @click='goLookScene'>
					<img class="iconslot" style="background: #aeb8d4;" src="../../assets/imgs/look.png" slot='icon' />
				</van-grid-item>
			</van-grid>
		</div>

	</div>
</template>

<script>
	export default{
		data(){
			return{
				allInfo:[],
				userInfo:{}
			}
		},
		created(){
			//this.getUserInfo()
      this.getUnRepairList()
		},
		methods:{
      goEditCurMan(){
        this.$router.push({name:'editCurMan'})
      },
      goAddCurMan(){
        this.$router.push({name:'addCurMan'})
      },
			/* getUserInfo(){
				this.$axios.post(this.url.searchUser,{number:JSON.parse(localStorage.cksLoginInfo).id,name:''}).then(res=>{
					if(res.data.status === 200){
						this.userInfo.role = res.data.data[0].rolename
						this.userInfo.depart = res.data.dep[0].name
						if(this.userInfo.role === '维修员') this.getUnRepairList()
						if(this.userInfo.role === '保养员') this.getUnKeepList()
					}
				})
			}, */
			//获取未保养设备
			getUnKeepList(){

			},
			//获取未维修设备
			getUnRepairList(){
				this.$axios.post('/Maintenance/selectAllMaintenance.do').then(res=>{
					if(res.data.status===200){
						let newData = res.data.msg

						newData.map((value,index)=>{
							if(!value.maintanceusername){

								this.allInfo.push(value)
							}
						})

					}

				})
			},
			goChangeFor(){
				this.$router.push({name:'addApplication'})
			},
			goRepairSearch(){
				this.$router.push({name:'repairdeviceList',params:{isMe:false}})
			},
			goKeepSearch(){
				this.$router.push({name:'deviceKeep',params:{display:true}})
			},
			goLookScene(){
				this.$router.push({name:'lookScene'})
			},
			goRepair(){
				this.$router.push({name:'repair'})
			},
			goCheck(){
				this.$router.push({name:'check'})
			},
			goDeviceAdd(){
				this.$router.push({name:'addDevice'})
			},
			goKeep(){
				this.$router.push({name:'addKeep'})

			},
			goDeviceFault(){
				this.$router.push({name:'deviceFault'})
			},
			//设备
			goDevice(){
				this.$router.push({name:'device'})
			},
			goGateway(){
				this.$router.push({name:'gateway'})
			}
		}
	}
</script>

<style scoped="scoped">
	.noData{
		text-align: center;
	}
	.index{
		overflow: scroll;
	}
	.van-nav-bar__title{
		color: white;
	}
	.border{
		background: whitesmoke;
		height: .8rem;
		margin-top: 4rem;
	}
	.noticeImg{
		vertical-align: middle;
		width: .8rem;
		height: .8rem;
	}
	h6{
		display: inline-block;
		margin: 0;
		font-size: .8rem;
	}
	.notice{
		background: white;
		border-radius: .7rem;
		padding: .9rem;
		position: absolute;
		width: 80%;
		z-index: 99;
		margin-right: 10px;
		height: 7rem;
		overflow: scroll;
	}
	.van-nav-bar{
		color: white;
		background: #62cff9;

	}
	.bg{
		position: relative;
		height: 6rem;
		display: flex;
		justify-content: center;
		background: #62cff9;
		padding-top: 0;
	}
	.device {
		margin: .6rem;
		box-shadow: 5px 10px 7px 2px rgba(0,0,0,0.1);
	}

	.title {
		margin: 0;
		margin-top: 1.3rem;
		padding-bottom: .5rem;
		border-bottom: 1px solid #eee;
		padding-left: 1rem;
		padding-top: .5rem;
	}

	.iconslot{
		height: 1.4rem;
		padding: .5rem;
		border-radius: 50%;
		width: 1.4rem;
		object-fit: contain;
	}
	.noticeInfo{
		display: flex;
		align-items: center;
		color: #999999;
		font-size: .73rem;
		margin-top:1rem;
	}
	.dot{
		margin-right: .6rem;
		border-radius: 50%;
		display: inline-block;
		height: .2rem;
		width: .2rem;
		background: #ea986c;
	}
</style>
